<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport"
          content="width=device-width,height=device-height, initial-scale=1,maximum-scale=1,user-scalable=0">
    <title>招聘信息</title>
    <link rel="stylesheet" href="../css/bootstrap.min.css">
    <link rel="stylesheet" href="../../tool/jquery-mobile/1.3.2/jquery.mobile-1.3.2.min.css">
    <link rel="stylesheet" href="../../tool/jquery-mobile/1.3.2/jquery.mobile-u.css">
    <link rel="stylesheet" href="../css/default.min.css">
    <link rel="stylesheet" href="../css/fairList.css">
    <script src="../tool/jquery/jquery-1.11.2.min.js"></script>
    <script src="../tool/jquery-mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
    <script src="../js/common.js"></script>
    <script src="../js/http.js"></script>
</head>
<body>
<div style="position:fixed;left:0;top:0;width:100%;z-index:200;">
    <div class="sel_city">
        <img src="../image/badou-logo.png" style="height:50px;width:60px; position:absolute; left: 0px; top:0px;"/>
        <div style="width: 80%; position: absolute;right: 10px;top: 10px;">
            <div class="search-content">
                <input data-role="none" class="" id="keywords" type="text" name="searchText" placeholder="输入职位">
                <button data-role="none" class="search-btn"
                        style="height: 50px;width: 25px;margin-top: -10px;left: 22px"></button>
            </div>
        </div>
    </div>
    <div class="ui-header">
        <ul class="drop-menu ui-icon-alt">
            <li><span data-target="#cityContainer" class=""><menu_caption>城市</menu_caption><span
                    class="ui-icon ui-icon-shadow ui-icon-arrow-d">&nbsp;</span></span></li>
            <li><span data-target="#salaryTypeContainer" class=""><menu_caption>薪资</menu_caption><span
                    class="ui-icon ui-icon-shadow ui-icon-arrow-d">&nbsp;</span></span></li>
            <li><span data-target="#educationContainer" class=""><menu_caption>学历</menu_caption><span
                    class="ui-icon ui-icon-shadow ui-icon-arrow-d">&nbsp;</span></span></li>
        </ul>
        <ul class="menu flip" id="cityContainer" data-property='city'></ul>
        <ul class="menu flip" id="salaryTypeContainer" data-property='salary'></ul>
        <ul class="menu flip" id="educationContainer" data-property='education'></ul>
    </div>
</div>
<div class="arrow-down"></div>
<div class="overlay"></div>
<div class="delay"><p>正在努力查找...</p></div>
<div class="content" style="padding-top: 90px;"></div>
<div class="mf-msg-notice"><span class="notice-text">上拉加载更多</span></div>
<div class="text-center page"></div>
<table class="fix_table">
    <tbody>
    <tr style="border-top:1px solid #dddddd">
        <td class="fix_book_td_active" id="fairs">
            <div>岗位列表</div>
        </td>
        <td class="fix_book_td" id="apped">
            <div>我的反馈</div>
        </td>
        <td class="fix_book_td" id="resume">
            <div>我的简历</div>
        </td>
    </tr>
    </tbody>
</table>
</body>
<script type="text/javascript">

    document.onkeyup = function (event) {
        var e = event || window.event;
        var keyCode = e.keyCode || e.which;
        switch (keyCode) {
            case 13:
                var searchBtn = $(".search-btn");
                searchBtn.focus();
                searchBtn.click();
                break;
            default:
                break;
        }

    };

    $(document).on("pageinit", "div[data-role='page']", function () {
        var pageNumber = 0;
        var position = "";
        var education = "";
        var salary = "";
        var hasNextPage = true;
        var city = "";

        //注册滚动条滑动事件
        $(window).scroll(function () {
            if ($(document).scrollTop() >= $(document).height() - $(window).height()) {
                if (hasNextPage) {
                    $(".notice-text").text("加载中...");
                    var result = search(0, getSearchJson());
                    pageNumber = pageNumber + 1;
                    if (result) {
                        $(".notice-text").text("已经到底了~");
                    }
                } else {
                    $(".notice-text").text("已经到底了~");
                }
            }
        });

        var getSearchJson = function () {
            return {
                "pageNo": pageNumber,
                "city": city,
                "position": position,
                "education": education,
                "salary": salary
            };
        };

        //查询
        $(".search-btn").click(function () {
            position = $("#keywords").val();
            pageNumber = 0;
            search(1, getSearchJson());
        });

        // 渲染 岗位列表
        var setFairData = function (type, data) {
            if (type === 1) {
                $(".content").children().remove();
            }

            hasNextPage = !data.last;

            var div_play_time = $("<div></div>").addClass("play_time");
            div_play_time.append($("<div></div>").addClass("date_div").append($("<span></span>").addClass("date_span")));
            div_play_time.appendTo($(".content"));
            $.each(data.content, function () {
                var job = this;
                var interviewTime = job.interviewAt || "待通知";
                var projectName = job.jobName || "岗位名称";
                var projectSalary = job.salaryScope || "薪酬面议";
                var companyName = job.companyName || "招聘单位";
                var jobPlace = job.jobPlace || "地址不详";
                var logoUrl = job.companyLogo ? common.companyLogoPathRoot + "/" + job.companyLogo : common.ctx + "/image/project-icon/empty.png";
                var div_jod_child = $("<div></div>").addClass("job_child");
                div_jod_child.append($("<div></div>").append($("<span></span>").addClass("job_name").text(projectName)));

                var img_logo = $("<img>").addClass("logo_img").attr("src", logoUrl);
                var div_display = $("<div></div>").addClass("display_div");

                var split_span = $("<span></span>").addClass("split_span").text(" | ");
                var customer_span = $("<span></span>").addClass("customer_span").text("招聘企业: " + companyName);

                var sal_span = $("<span></span>").addClass("sal_span").html("岗位薪资: <span style=\"color:#e97500;\">" + projectSalary + "</span>");
                var address_span = $("<span></span>").addClass("address1_span").text("工作地点: " + jobPlace);
                var time_span = $("<div></div>").addClass("address1_span").css({
                    float: "left",
                    "width": "75px"
                }).text("面试时间: ");

                var times_div = $("<div></div>").css({float: "left", "padding-top": "5px"});
                times_div.append($("<p></p>").css({"line-height": "15px"}).text(interviewTime));

                div_jod_child.append(img_logo);
                div_jod_child.append(div_display);
                div_display.append($("<div></div>").addClass("customer_div").append(customer_span));
                div_display.append($("<div></div>").addClass("sal_div").append(sal_span));
                div_display.append($("<div></div>").addClass("address1_div").append(address_span));
                div_display.append($("<div></div>").addClass("address1_div").append(time_span).append(times_div));
                div_display.append($("<div></div>").addClass("kuochong"));
                div_jod_child.append($("<div></div>").addClass("book_btn").addClass("book_btn_all").attr("name", job.id));

                div_jod_child.click(function () {
                    goProject($(this).find(".book_btn").attr("name"));
                });

                div_jod_child.appendTo($(".content"));
            });
        };

        var search = function (type, paramData) {
            $(".overlay").show();
            $(".delay").show();
            http.post({
                url: common.sctx + '/job/list.do',
                data: paramData,
                success: function (data) {
                    $(".delay").hide();
                    $(".overlay").hide();
                    setFairData(type, data);
                }
            });
            return true;
        };

        //跳转到详情页
        var goProject = function (id) {
            window.location.href = common.ctx + "/html/jobDetail.html?id=" + id;
        };

        var setSearchItemContainer = function (items, containerId, dataType, title) {
            var itemArrayHtml = [];
            itemArrayHtml.push('<li><span data-type="'+dataType+'" data-title="'+title+'" class="selected" data-key="">不限</span></li>');
            $.each(items, function () {
                itemArrayHtml.push('<li><span data-type="'+dataType+'" data-title="'+this.name+'" data-key="'+this.value+'">'+this.name+'</span></li>');
            });
            $("#"+containerId).append(itemArrayHtml.join(""));
        };

        var getItems = function () {
            http.get({
                url: common.sctx + "/commons/items/"+"City,SalaryScope,DiplomaType.do",
                data: [],
                success: function (data) {
                    setSearchItemContainer(data['City'], 'cityContainer', 'CITY', '城市');
                    setSearchItemContainer(data['SalaryScope'], 'salaryTypeContainer', 'SALARY', '薪资');
                    setSearchItemContainer(data['DiplomaType'], 'educationContainer', 'EDUCATION', '学历');

                    // 搜索菜单点击事件
                    $(".menu>li").click(function (e) {
                        e.stopPropagation();
                        var _curSpan = $(this).find("span");
                        if (!_curSpan.hasClass("selected")) {
                            $(".menu.in>li>span.selected").removeClass("selected");
                            _curSpan.addClass("selected");
                            var _curSpan_b = $(".drop-menu>li>span.selected>menu_caption");
                            _curSpan_b.text(_curSpan.data("title"));
                            _curSpan_b[(_curSpan.data("key") ? "add" : "remove") + "Class"]("selected");
                            var filters = buildFilter();
                            var _li_list = $('[data-role="listview"]>li');
                            _li_list.hide();
                            $.each(_li_list, function (i, li) {
                                for (var k in filters) {
                                    var value = filters[k];
                                    if (typeof value !== "undefined") {
                                        if ($(li).data(k) !== value) {
                                            return true
                                        }
                                    }
                                }
                                $(li).show()
                            });
                        }
                        triggerFilter();
                        var select_value = _curSpan.data("key");
                        var search_type = _curSpan.data("type");
                        if (search_type === "CITY") {
                            city = select_value;
                        } else if (search_type === "EDUCATION") {
                            education = select_value;
                        } else if (search_type === "SALARY") {
                            salary = select_value;
                        }
                        position = $("#keywords").val();
                        pageNumber = 0;
                        search(1, getSearchJson());
                    });
                }
            });
        };
        getItems();

        $(".sel_city_span").click(function () {
            $(".overlay").show();
            $(".sel_city_content").show();
        });

        $(".select_chanel").click(function () {
            $(".overlay").hide();
            $(".sel_city_content").hide();
        });

        $(".m_btn").click(function (e) {
            if (!$(this).hasClass("selected")) {
                $($(this).attr("href")).toggle();
                $($(".m_btn.selected").attr("href")).toggle();
                $(".m_btn.selected").removeClass("selected").removeClass("ui-btn-active");
                $(this).addClass("selected").addClass("ui-btn-active")
            }
        });

        var triggerFilter = function (e) {
            if (e) {
                e.stopPropagation()
            }
            $(".menu:visible").removeClass("in")
                .addClass("out");
            $("div.mask").remove();
            $(".drop-menu>li>span.selected>.ui-icon").addClass(
                "ui-icon-arrow-d").removeClass(
                "ui-icon-arrow-u").parent().removeClass(
                "selected")
        };

        var buildFilter = function () {
            var filters = {};
            var hasProperty = false;
            $(".menu>li>span.selected").each(function (idx, span) {
                var value = $(span).data("key");
                if (value) {
                    hasProperty = true
                }
                var key = $(span).parents("ul.menu").data("property");
                filters[key] = value
            });
            if (hasProperty) {
                window.sessionStorage.setItem("1tjob_filters", JSON.stringify(filters))
            } else {
                window.sessionStorage.removeItem("1tjob_filters")
            }
            return filters
        };

        $(".drop-menu>li>span").click(function (e) {
            e.stopPropagation();
            var isSelf = $(this).hasClass("selected");
            var target = $(".menu:visible");
            triggerFilter();
            target.removeClass("in");
            if (!isSelf) {
                $(this).addClass("selected");
                $(this).find(".ui-icon").removeClass("ui-icon-arrow-d").addClass("ui-icon-arrow-u");
                $(".drop-menu").parent().after('<div class="mask"></div>');
                $($(this).data("target")).addClass("in");
                target.removeClass("out")
            } else {
                target.addClass("out")
            }
        });

        $(document).off("click", "div.mask").on("click", "div.mask", triggerFilter)

        //底部菜单链接
        $("#apped").click(function () {
            window.location.href = common.ctx + "/html/appoiList.html";
        });
        $("#resume").click(function () {
            window.location.href = "/html/resume.html";
        });
        $("#result").click(function () {
            window.location.href = common.ctx + "/html/result.html";
        });
        $("#sign").click(function () {
            window.location.href = common.ctx + "/html/sign.html";
        });
        $("#fairs").click(function () {
            return false;
        });

    });

</script>

</html>